import Model from './Model.vue'

const ModelPlugin = {
  install (Vue, options) {
    let ModelVm;

    Vue.component(Model.name, Model);

    const show = function (props) {
      /***/
      // 渲染一个组件上带有<my-model type=""/> 的标签
      const Model = Vue.extend({
        render(h) {
          return h(
            // 标签名
            'my-model',
            // 标签的属性
            // 在渲染标签时进行传值
            {props},
            // 字节点
          )
        },
      })
      ModelVm = new Model({
        propsData: {
          ...props
        }
      });
      // 返回该组件实例
      this.vm = ModelVm.$mount();
      // 将该节点添加到页面上
      document.body.appendChild(this.vm.$el);
    };

    const hide = function () {
      // 清理节点
      document.body.removeChild(this.vm.$el);
      // 销毁实例
      ModelVm.$destroy();

      this.vm = null;
      // 将组件实例销毁
    };

    Vue.prototype.$message = {
      show,
      hide
    };
  }
}

export default ModelPlugin